Welcome to Creationbangla-24. কেমন আছেন বন্ধুরা? আশা করি মহান আল্লাহ্ তা'য়ালার অশেষ রহমতে ভালো আছেন। আপনারা অবশ্যই Title দেখে বুঝতে পেরেছেন এই পেজে কী বিষয় নিয়ে আলোচনা করতে যাচ্ছি। তো আপনাদের জানিয়ে রাখি এটি একটি শিক্ষা বিষয়ক সাইট। এই site এ আমি নির্দিষ্ট কিছু বিষয় নিয়ে ধারাবাহিক ভাবে লিখব। আপনাদের একটি কথা না বললেই নয় যে, এই Page টি ভালোভাবে বুঝার জন্য এবং Page টি থেকে উপকৃত হওয়ার জন্য সম্পূর্ণ Page টি মনযোগ সহকারে পড়বেন। এখন এই পেজটিতে আপনাদের সাথে আলোচনা করতে যাচ্ছি "bdi tag এর ব্যবহার। অর্থাৎ কোনো টেক্সকে অন্য কোনো টেক্স থেকে বিচ্ছিন্ন করার নিয়ম" সম্পর্কে এবং আপনাদের সাথে আছি আমি Md.Aiub তো চলুন বন্ধুরা শুরু করা যাক।
<bdi>ট্যাগ কোনো টেক্স এর একটি অংশকে বিচ্ছিন্ন করে যা এর বাইরে অন্য টেক্স থেকে ভিন্ন দিকে ফর্ম্যাট করে বা প্রবাহিত হয়। যখন কোনো ব্যবহাকারী এমন কিছু টেক্স লিখে যা কোন দিক থেকে প্রবাহিত হয় তা ব্যবহারকারি জানে না, এমন সময় এই ট্যাগ কার্যকর হয় এবং ঐ টেক্সকে সঠিক দিক থেকে প্রবাহিত করে। সেটি হতে পারে ডান থেকে বাম দিকে বা বাম থেকে ডান দিকে।
এই ট্যাগ ব্যবহার করা হয় টেক্সের ছোট কোনো অংশ বিচ্ছিন্ন করতে। আরবি বা হিব্রু জাতীয় ভাষা ডান থেকে বাম দিকে প্রবাহিত হয়। আবার ইংরেজি বা বাংলা জাতীয় ভাষা বাম থেকে ডান দিকে প্রবাহিত হয়। কোনো ভাষা বাম থেকে ডান দিকে প্রবাহিত ভাষার সাথে বা ডান থেকে বাম দিকে প্রবাহিত ভাষার সাথে ইনলাইন ব্যবহার করা হলে এটি কার্যকর হয়।
তবে মনে রাখতে হবে যে <bdi> Tag সোর্স কোডের অক্ষরের দিকটিকে বিপরীত করে না। বরং এটি ব্রাউজারে তথ্য সরবরাহ করে যাতে অন্য LTW পরিবেশে (বা তৎবিপরীদ) RTL অক্ষরের উপস্থিতি কোনো Translate সমস্যা তৈরি না করে।
<bdi> ট্যাগ এর গঠনপ্রনালী:<bdi> ট্যাগ এর গঠনপ্রনালী হলো <bdi>...Given your text...</bdi>
HTML-5 এটি একটি নতুন ট্যাগ। এই ট্যাগে Global Attributes এবং Event Attributes Support করে।
HTML-5 এটি একটি নতুন ট্যাগ। এই ট্যাগে Global Attributes এবং Event Attributes Support করে।
নিম্নে <bdi< ট্যাগ ব্যবহার করে কোডিং করে দেখানো হলো। আপনি চাইলে কোড বা টেক্স পরিবর্তন করে এখানেই অনুশীলন করতে পারেন এবং Run Code Button এ ক্লিক করে উক্ত কোডের Output দেখতে পারেন । আবার আপনি চাইলে Copy Code Button এ ক্লিক করে কোডগুলো কপি করতে পারেন এবং তা আপনার প্রয়োজনে ব্যাবহার করতে পারেন।
উপরিউক্ত Tag বিশ্লেষণ ও কাজের বর্ণনা :
- <!doctype html> এটাকে আসলে সম্পূর্ণ কোন Tag বলা হয় না। <!doctype html> ট্যাগ ব্যবহার করা হয় <html> ট্যাগ এর পূর্বে। যা ওয়েব ব্রাউজার কে html এর ভার্সন বলে দেয়। যাতে ওয়েব ব্রাউজার ওয়েব কন্টেন্ট গুলোর সাথে ভালো ভাবে কাজ করতে পারে। আর <!doctype html> ট্যাগ এর প্রধান কাজ হচ্ছে ওয়েব ব্রাউজার কে বলে দেওয়া যে, ওয়েব পেজটির Document type. HTML5 Standard.
- <html> ট্যাগ দ্বারা ওয়েব ব্রাউজারকে নির্দেশ করা হয়েছে যে, এই ওয়েব পেজটি HTML ভাষায় তৈরী।
- <head> ট্যাগ ওয়েবপেজ সম্পর্কিত তথ্য ধারণ করে। এখানে ওয়েব পেজের শিরোনাম রাখা হয়েছে <head> ট্যাগ এর মাঝে। তাছাড়াও <head> ট্যাগ এর মাঝেই আপনাকে Style sheet, Script, meta ট্যাগ ব্যবহার করতে হবে।
- <title> ট্যাগ ওয়েবপেজের শিরোনাম ধারণ করে। <title> ট্যাগ এর মাধ্যমে ওয়েবপেজের শিরোনাম শুরু করা হয়েছে এবং সম্পূর্ণ শিরোনামটি এই ট্যাগ এর মধ্যেই রাখতে হবে।
- </title> ট্যাগ এর মাধ্যমে ওয়েবপেজের শিরোনাম শেষ করা হয়েছে। অর্থাৎ <title> ট্যাগ বন্ধ করা হয়েছে। এই ট্যাগ এর বাইরে কিছু লিখলে সেটা ওয়েব পেজের শিরোনাম বলে গণ্য হবে না।
- </head> ট্যাগ এর মাধ্যমে <head> বন্ধ করা হয়েছে।
- <body> ট্যাগ ওয়েবপজের মূল উপাদান ধারণ করে। আপনি ওয়েবপেজে যা প্রদর্শন করাতে চান সেই সম্পর্কিত সকল ট্যাগ <body> ট্যাগ এর মধ্যে রাখতে হবে।
- <ol> ট্যাগ এর মাধ্যমে ওয়েব পেজে একটি Order list ঘোষণা করা হয়েছে।
- <li> ট্যাগ এর মাধ্যমে Order list এর আওতাভূক্ত একটি Item তৈরি করা হয়েছে।
- <bdi> ট্যাগ এর মাধ্যমে বাম দিকে প্রবাহিত ভাষা সাথে ডান দিকে প্রবাহিত ভাষার এবং ডান দিকে প্রবাহিত ভাষা সাথে বাম দিকে প্রবাহিত ভাষার Inline ব্যবহার কর্যকর করা হয়েছে।
- </bdi>ট্যাগ এর মাধ্যমে বাম দিকে প্রবাহিত ভাষা সাথে ডান দিকে প্রবাহিত ভাষার এবং ডান দিকে প্রবাহিত ভাষা সাথে বাম দিকে প্রবাহিত ভাষার Inline ব্যবহার কর্যকর শেষ করা হয়েছে। এর বাইরে দ্বি-মুখী প্রবাহিত কোনো কিছু লিখলে তা সঠিক ভাবে কার্যকর নাও হতে পারে।
- </li> ট্যাগ এর মাধ্যমে Order list এর আওতাভূক্ত তৈরিকৃত একটি Item শেষ করা হয়েছে। এর বাইরে কোনো কিছু লিখলে তা Order list এর আওতাভূক্ত তৈরিকৃত একটি Item Text বলে বিবেচিত হবে না।
- </ol> ট্যাগের মাধ্যমে Order list টি বন্ধ করা হয়েছে। এর বাইরে কোনো কিছু লিখলে তা Order list ًকোনো Content বলে বিবেচিত হবে না।
- </body> Tag এর মাধ্যমে <body> ট্যাগ বন্ধ করা হয়েছে।
- </html> Tag Tag এর মাধ্যমে <html> ট্যাগ বন্ধ করা হয়েছে। অর্থাৎ Html ভাষায় তৈরিকৃত ওয়েজপেজটি শেষ করা হয়েছে। এই ট্যাগ এর বাইরে কিছু লিখলে তা Html ভাষায় তৈরিকৃত ওয়েজপেজটির কোনো Document বলে বিবেচিত হবে না।
ًপ্রিয় পাঠক বন্ধুরা,
আপনারা যদি এই পেজটি পড়ে উপকৃত হন তাহলে আমার পরিশ্রম স্বার্থক হবে। উপকৃত হয়ে থাকলে এই পেজটি আপনার বন্ধুদের মাঝে শেয়ার করতে ভুলবেন না। আপনার মতামত প্রকাশ করতে চাইলে কমেন্ট বক্সে কমেন্ট করতে পারেন। এতোক্ষণ ধর্য্যসহকারে Page টি পড়ার জন্য এবং আপনার মূল্যবান সময় আমাদের সাথে ব্যয় করার জন্য ধন্যবাদ। এর পরের Page এ আপনাদের সাথে "<bdo> Tag অর্থাৎ বর্তমান Text Direction কে Override" নিয়ে আলোচনা করবো, সেই সময় পর্যন্ত আমদের সাথে থাকার আমন্ত্রণ রইল। আপনাদের সকলে সুস্বাস্থ্য ও দীর্ঘায়ু কামনা করে আজকের মতো শেষ করছি,
আল্লাহ হফেজ...
আপনারা যদি এই পেজটি পড়ে উপকৃত হন তাহলে আমার পরিশ্রম স্বার্থক হবে। উপকৃত হয়ে থাকলে এই পেজটি আপনার বন্ধুদের মাঝে শেয়ার করতে ভুলবেন না। আপনার মতামত প্রকাশ করতে চাইলে কমেন্ট বক্সে কমেন্ট করতে পারেন। এতোক্ষণ ধর্য্যসহকারে Page টি পড়ার জন্য এবং আপনার মূল্যবান সময় আমাদের সাথে ব্যয় করার জন্য ধন্যবাদ। এর পরের Page এ আপনাদের সাথে "<bdo> Tag অর্থাৎ বর্তমান Text Direction কে Override" নিয়ে আলোচনা করবো, সেই সময় পর্যন্ত আমদের সাথে থাকার আমন্ত্রণ রইল। আপনাদের সকলে সুস্বাস্থ্য ও দীর্ঘায়ু কামনা করে আজকের মতো শেষ করছি,
আল্লাহ হফেজ...
Post a Comment